$btn-font-color: #19D3D7; 
page {
	// background: linear-gradient(to bottom right, $btn-font-color , #7D27FF);
	// background:$page-color-light;
	height: 100%;
}
.icon {
		color:#ffffff;
	}
.logo {
	width: 100%;
	height: 268px;
	display: flex;
	justify-content: center;
	align-items: center; 
	.img {
		width: 45%;
		// height: 25vw;

		image {
			width: 100%;
			// height: 100px;
			// border-radius: 100%;
		}
	} 
	    // background: linear-gradient(70deg,#0081ff, #0abba2);
	    
		    border-radius: 0 0 5% 5%;
		    margin-bottom: 10px;
		    // background: white;
}
.bg {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
	}
.form {
	// width: 86%;
	padding: 0 7%;
	font-size: 30upx;
	.username,
	.password,
	.code {
		// width: calc(100% - 90upx);
		height: 90upx;
		display: flex;
		align-items: center;
		border-radius: 45upx;
		background-color: $page-color-light;
		padding: 0 45upx;
		margin-bottom: 26upx;
		input {
			width: 100%;
			height: 50upx;
			color: rgba($color: #000000, $alpha: 0.8);
			font-weight: 200;
		}
	}

	.btn {
		background-color: $button-bg;
		color: $button-font;
		// color: $btn-font-color;
		// background-image: linear-gradient(to right, #0EE7D2, #7D27FF); 
		width: 100%;
		height: 90upx;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 45upx; 
		font-size: 40upx;
	}
	 
}
.re {
		.username{
			position: relative;
			.get-code{
				position: absolute;
				height: 90upx;
				display: flex;
				align-items: center;
				justify-content: center;
				right: 0;
				padding: 0 40upx;
				z-index: 3;
				&:after {
					content: " ";
					width: 1upx;
					height: 50upx;
					background-color: #fff;
					position: absolute;
					z-index: 3;
					margin-right: 100%;
					left: 0;
					top: 20upx;
				}
			}
			
		}
		.res {
			display: flex;
			justify-content: space-between;
			align-items: center;
			height: 100upx;
			color: #8799a3;
		}
	}
	
